.bigweb {
	background: $cf5;@extend .cf;
}

.breadcrumb {
	@extend .web;padding: 15px 0;
	color: $c99;
}

.bar {
	width: 240px;float: left;
	.bar_box {
		margin-bottom: 15px;background: $cff;padding: 15px;
		.bar_box_head {
			height: 30px;line-height: 30px;color:$c22;
			font-size: 16px;
			.more {float: right;font-size: 12px;padding-right: 10px;font-weight: normal;color: $c55;}
		}
		.bar_goods {
			li {
				padding: 5px 0;
				&:last-child {border: none;}
				a {display: block;@extend .cf;text-decoration: none;}
				img {width: 60px;height: 60px;float: left;margin-right: 10px;}
				strong {display: block;max-height: 36px;line-height: 18px;overflow: hidden;font-weight: normal;}
				em {display: block;margin-top: 5px;font-size: 14px;color: darken($red,10%);font-weight: bold;}
			}
			&.ranking {
				counter-reset: num;
				li {
					position: relative;
					&:before {
						content: counter(num);counter-increment: num;
						display: block;position: absolute;right: 5px;bottom: 3px;font-size: 14px;
						font-style: italic;z-index: 1;color: $cff;
					}
					&:after {
						content: "";position: absolute;right: 0;bottom: 0;width: 0;height: 0;display: block;
						border-style: solid;border-width: 14px;border-color: transparent $red $red transparent;
					}
					&:nth-child(n+4):after {
						border-color: transparent $c99 $c99 transparent;
					}
				}
			}
		}
		.bar_nav {
			li {
				height: 28px;line-height: 28px;overflow: hidden;padding-left: 20px;

			}
		}
	}
	.bar_goods_nav {
		dl {
			@extend .cf;
			border-bottom: 1px dashed $cdd;padding: 10px;
			&:last-child {border: none;}
			dt {
				height: 24px;line-height: 24px;font-weight: bold;
				a {color: $c99;}
			}
			dd {
				width: 50%;float: left;text-indent: 10px;position: relative;
				@include oneline(20px);
				&:after {
					content: "";width: 3px;height: 3px;background: $cf60;display: block;
					position: absolute;left: 0;top: 8px;
				}
			}
		}
	}
}

.main {
	width: 1200-285px;float: right;background: $cff;padding: 15px;margin-bottom: 15px;
}

.main_head {
	height: 30px;line-height: 30px;color: $c22;font-size: 18px;

	mark {padding: 0 5px;background: none;color: $pink;}
	.barnd_web {
		float: right;margin-right: 15px;text-decoration: none;@include dz();
	}
}
.article_list {
	li {
		height: 45px;line-height: 45px;padding: 0 10px;
		font-size: 15px;
		a {display: block;}
		time {float: right;color: $c99;font-size: 12px;}
		&:hover {
			background: $cfa;
		}
	}
}

.pages_bar {
	margin: 20px;text-align:center;color:$c55;
	a,span {
		display:inline-block;margin:0 3px;padding:5px 8px;border-radius: 4px;
		text-align:center;color:$c55;background: $cf5;@include dz();
	}
	a:hover {background: $cf60;color: $cff;text-decoration: none;}
	a.current_page {background: $cf60;color:$cff}
	span{color:$c99}
}


/* article read page style */
$artWidth:895px;
$artLineColor:#ddd;
$artTitleColor:#f60;
$artBgColor:#fafafa;
$artAColor:#555;
.article {width: $artWidth;overflow: hidden;line-height: 2;padding: 10px;}
.article_title{color:$artTitleColor; font-size: 22px;padding: 10px 0}
.article_date{height:28px; line-height:28px;color: $c99;display: block;background: $cfa;text-indent: 2em;}
.article_content {
	padding: 10px 0;
	font-size:13px;width:895px; overflow:hidden;
	p { padding:5px 0;text-indent: 2em;}
	a,span,em,i,u,strong,b {padding: 0 5px;}
	u {text-decoration: none;border-bottom: 1px solid $c55;}
	img {
		max-width: 895px;
		text-align:center; display:block; margin:5px auto;
	}
	a:link,a:visited,a:active{color: $blue;}
	a:hover{color:$cf60;}
	h1,h2,h3,h4,h5,h6{
		color: $c22;font-weight: bold;
	}
	embed {width:510px; height:400px; display:block; margin:10px auto;}
	table {
		width:100%; border:1px solid $cdd;font-size:12px;background: $cff;margin: 5px auto;
		th {color:$cff;font-size:14px;background: $c55;}
		th,td {border:1px solid $cdd;padding:3px 8px;}
		h1,
		h2,
		h3,
		h4,
		h5,
		h6 { line-height:150%; overflow:hidden; font-size:12px; background:none; border:none;}
		tr:hover { background:$cff;}
		img {display:inline; border:none}
		tr td a:link,tr td a:visited,tr td a:active,tr td a:hover{ font-size:12px;}
	}

	h1 {font-size:20px;}
	h2 {font-size:18px;}
	h3 {font-size:16px;}
	h4 {font-size:14px;}
	h5 {font-size:14px;}
	h6 {font-size:14px;}
	h1 a:link,h1 a:visited,h1 a:active,h1 a:hover{font-size:20px;}
	h2 a:link,h2 a:visited,h2 a:active,h2 a:hover{font-size:18px;}
	h3 a:link,h3 a:visited,h3 a:active,h3 a:hover{font-size:16px;}
	h4 a:link,h4 a:visited,h4 a:active,h4 a:hover{font-size:14px;}
	h5 a:link,h5 a:visited,h5 a:active,h5 a:hover{font-size:14px;}
	h6 a:link,h6 a:visited,h6 a:active,h6 a:hover{font-size:14px;}
}

.artice_goods {
	margin-top: 30px;
	h3 {
		height: 40px;line-height: 40px;text-indent: 15px;
		font-size: 14px;color: $c22;
		background: $cf0;
	}
	ul{@extend .cf;width:916px;}
	li {
		width: 229px;float: left;padding: 10px 0;background: $cff;
		a {
			width:199px;margin:10px auto;display: block;text-decoration: none;padding: 15px;
			position: relative;@include dz();top: 0;
			&:hover {
				top: -5px;box-shadow: 3px 5px 15px rgba($c99,.5);
			}
		}
		img {width: 199px;height: 199px;}
		strong {display: block;;margin: 5px auto;font-weight: normal;@include oneline(20px);}
		em {font-size: 16px;font-weight: bold;color: $red;}
	}
}
